
<template>
  <el-cascader ref="cascader" :value="propsValue" :show-all-levels="true" @change="changeCascader" :props="cascaderProps"
    clearable :placeholder="$tt('tip_please_select_anomaly_desc')" v-loading="loading" filterable ></el-cascader>
</template>

<script>

import role_system_mixin from '@/mixin/role_system_mixin';
export default {
  mixins: [role_system_mixin,],

  props: {
    classify: {
      type: [String, Number],
      default: null,
    },
    describe: {
      type: [String, Number],
      default: null,
    },
    classifyName: {
      type: String,
      default: null,
    },
    describeName: {
      type: String,
      default: null,
    },

    processNodeList: {
      type: [String, Array],
      default: 'COMMON'
    },
  },
  data() {
    return {
      loading: false,

      cascaderProps: {
        lazy: true, emitPath: true,
        lazyLoad: this.searchSelect
      },
    }
  },
  computed: {
    propsValue() {
      let out = []
      if (this.classify) out.push(String(this.classify))
      if (this.describe) out.push(String(this.describe))
      return out
    },
    propsLabel() {
      if (this.classifyName && this.describeName) {
        return `${this.classifyName} / ${this.describeName}`
      }
      return ""
    },
  },
  watch: {
    propsLabel: function (val) {
      this.$nextTick(() => {
        if (this.$refs.cascader) {
          this.$refs.cascader.inputValue = val
        }
      })
    },
  },
  methods: {

    changeCascader(e) {
      this.$emit('input', e)
      this.$emit('change', e)
      this.$emit('update:classify', e.length > 0 ? e[0] : null)
      this.$emit('update:describe', e.length > 1 ? e[1] : null)
      if (this.$refs.cascader) {
        const node = this.$refs.cascader.getCheckedNodes();
        if (_.isEmpty(node)) {
          this.$emit('classifyItem',  null)
          this.$emit('describeItem',  null)
          return
        }
        const nodePath = _.head(node).pathNodes;
        if (nodePath) {
          const list = nodePath.map(it => {
            return {
              name: it.data.label,
              id: it.data.value,
            }
          })
          this.$emit('classifyItem', list.length > 0 ? list[0] : null)
          this.$emit('describeItem', list.length > 1 ? list[1] : null)
          return
        }
      }
    },
    searchSelect(node, resolve) {

      const { level, value } = node;
      if (level == 0) {
        this.loading = true
        let url = ""
        if (this.isMainSystem) {
          url = this.$url['oms/BaseAnomalyClassify']
        } else if (this.isWmsSystem) {
          url = this.$url['wms/BaseAnomalyClassify']
        } else if (this.isTmsSystem) {
          url = this.$url['tms/BaseAnomalyClassify']
        }
        this.$ajax({
          url,
          success: (res) => {
            if (res.data && res.data.rows) {
              resolve(res.data.rows.map(it => { return { label: it.name, value: String(it.id), leaf: false } }));
            } else {
              resolve([]);
            }
          },
          fail: () => {
            resolve([]);
          },
          complete: () => {
            this.loading = false
          }
        })
        // this.loading = true
      } else {
        this.loading = true
        const data = {
          anomalyClassifyId: value,
        }
        let url = ""
        if (this.isMainSystem) {
          url = this.$url['oms/BaseAnomalyDescribeClassifyByNode']
        } else if (this.isWmsSystem) {
          url = this.$url['wms/BaseAnomalyDescribeClassifyByNode']
        } else if (this.isTmsSystem) {
          url = this.$url['tms/BaseAnomalyDescribeClassifyByNode']
        }
        if (!_.isEmpty(this.processNodeList)) data.processNodeList = this.processNodeList
        this.$ajax({
          url,
          data,
          success: (res) => {
            if (res.data && res.data.rows) {
              resolve(res.data.rows.map(it => { return { label: this.$formatNameCode(it.name, this.$enumShow(it.processNode, "AbnormaProcessNodeEnum")), value: String(it.id), leaf: true } }));
            } else {
              resolve([]);
            }
          },
          fail: () => {
            resolve([]);
          },
          complete: () => {
            this.loading = false
          }
        })
      }

    },

  },
}
</script>
